<template>
  <div>
    <van-nav-bar title="派件消息" left-arrow @click-left="goback"/>
    <van-list >
      <van-cell id="list1" v-for="item in listData">

        <div id="div1" >
          <div id="div2" >{{ item.createDate }}</div>
          <div id="div7">
            <div class="div4444" >
              <div id="div3" >快递{{item.title}}通知</div>
              <div id="div4" >{{ item.content }}</div>
            </div>
            <div @click="toDetails(item)"  class="div4444">
              <div id="div5" >点击查看详情</div>
              <div id="div6" > ></div>
            </div>
          </div>

        </div>
      </van-cell>
    </van-list>
    <div id="div8">
      -没有更多数据量-
    </div>
  </div>
</template>
<script>
import axios from "axios";
export default {
  name: "DeliveryInformation",
  data() {
    return {
      listData:null,
      login: JSON.parse(localStorage.getItem('login')),
    };
  },
  methods: {
    goback() {
      this.$router.go(-1);
    },
    toDetails(item){
      this.$router.push({
        path: '/deliveryMessageDetails',
        query: {
          item: item
        }
      });
    }
  },
  created() {
    axios.get('http://localhost:11219/express/message/getDisMessage/' + this.login.registerIp).then(res => {
      if (res.data.code == 200) {
        this.listData = res.data.data;
      }
    })
  },
}
</script>
<style scoped>
#div1{
  margin: 10px;
  border-radius: 5px;
}
#div2{
  margin-left: 30%;
  margin-right: 30% ;
  display: inline-block;
  width: 40%;
  text-align: center;
  color: #999999;
  height: 20px;
  background: #dadee1;
  border-radius: 10px;
  margin-bottom: 10px;
}
#list1{
  background: #f0f1f3;
}
.div4444{
  background: white;
}
#div3{
  margin-left: 5%;
  font-size: 16px;
  font-weight: bold;
}
#div4{
  margin-left: 5%;
  font-size: 14px;
  color: #999999;
  background: white;

  border-bottom: 1px solid #dadee1;
}
#div5{
  float: left;
  margin-left: 5%;
  font-size: 14px;
  color: #999999;

}
#div6{
  float: right;
  margin-right: 5%;
  font-size: 14px;

  color: #999999;
}
#div7{
  height: 80px;
  background: white;
}
#div8{
  margin-top: 20px;
  text-align: center;
  color: #999999;
  font-size: 14px;
}
</style>